<template>
  <div class="Layout">
    <svg width="100%" height="300px" viewbox="-200 -100 1000 200">
      <rect id="rect" width="50" height="50" fill="skyblue" transform-origin="25 25">
        <animateTransform attributeName="transform" attributeType="XML" type="rotate" to="360" dur="3s"
          repeatCount="indefinite" additive="sum" />
        <animateTransform attributeName="transform" attributeType="XML" type="scale" from="1" to="3" dur="3s" 
          repeatCount="indefinite" additive="sum" />
      </rect>
    </svg>
    <div class="Code">&lt;rect id="rect" width="50" height="50" fill="skyblue" transform-origin="25 25">
  &lt;animateTransform attributeName="transform" attributeType="XML" type="rotate" to="360" dur="3s" repeatCount="indefinite" additive="sum" />
  &lt;animateTransform attributeName="transform" attributeType="XML" type="scale" from="1" to="3" dur="3s" repeatCount="indefinite" additive="sum" />
&lt;/rect></div>
  </div>
</template>